<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<html xmlns="http://www.w3.org/1999/xhtml"
        xmlns:h="http://java.sun.com/jsf/html"
        xmlns:f="http://java.sun.com/jsf/core"
        xmlns:ui="http://java.sun.com/jsf/facelets"
        xmlns:p="http://primefaces.org/ui">



<f:view contentType="text/html">

<h:head>
	<title>Logística y Monitoreo</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

	<link rel="stylesheet" type="text/css" href="../css/demos.css"></link>

	<script type="text/javascript">
	
	</script>
	
</h:head>

<h:body>

   <h:form id="form">  		

   	<div id="header" class="ui-widget ui-widget-header">
			<div id="logo">
				<img src="../images/logo.png" alt="Logo" />
			</div>
	</div>
	
	<h1 class="title ui-widget-header ui-corner-all"> Reporte de ventas</h1>

   		<h:panelGrid id="reporte" columns="5" columnClasses="labelColumn,inputColumn">
				
				<h:outputText value="Portal Web"></h:outputText>
				<p:selectOneMenu id="moduloSelect" value="#{reporteVentaBean.modulo}">  
                	<f:selectItem itemLabel="Todos" itemValue="" />  
                	<f:selectItems id="siModulos" value="#{reporteVentaBean.modulos}" />  
                	<p:ajax update="venta, total"  listener="#{reporteVentaBean.handlePortalChange}" />  
           		 </p:selectOneMenu>  
						
				<h:outputText value="Total: $"></h:outputText>
				<h:outputText id="total" var="total" value="#{reporteVentaBean.total}"></h:outputText>
				
		</h:panelGrid>
   	
   		<p:dataTable id="venta" var="venta" value="#{reporteVentaBean.ventas}">  
	 
	  		<p:column headerText="Nro.Venta" style="text-align: center">  
		            #{venta.nroVenta}  
		    </p:column> 
	  
			<p:column headerText="Portal Web" style="text-align: center">  
		            #{venta.idModuloPortalWeb}  
	        </p:column>  
	  
	        <p:column headerText="Fecha y Hora Venta" style="text-align: center">  
	            #{venta.fechaVenta}  
	        </p:column>  
  
	        <p:column headerText="Monto" style="text-align: center">  
	            #{venta.monto}  
	        </p:column>  
	        
	        <p:column headerText="Nro. Despacho" style="text-align: center">  
	            #{venta.nroDespacho}  
	        </p:column> 
	                	  
	         <p:column headerText="Fecha y Hora Despacho" style="text-align: center">  
	            #{venta.fechaDespacho}  
	        </p:column>
	        
	        <p:column headerText="Despacho" style="text-align: center">  
	            #{venta.idModuloDespacho}  
	        </p:column>
	        
	        <p:column headerText="Estado" style="text-align: center">  
	            #{venta.estado}  
	        </p:column>
	        		
	        		
	        				        
	        <p:column headerText="Ver items" style="text-align: center; width:60px">  
                <p:commandButton id="selectButton" update=":form:display" oncomplete="ventaDialog.show()" icon="ui-icon-search" title="Ver items">  
              	  <f:setPropertyActionListener value="#{venta}" target="#{reporteVentaBean.selectedVenta}" />  
                </p:commandButton>   
 			</p:column>
	        
		</p:dataTable>  
		
		<p:dialog header="Items de la venta" widgetVar="ventaDialog" resizable="false" id="ventaDlg"  
                showEffect="fade" hideEffect="explode" modal="true" >  
                
	 		<h:panelGrid id="display" columns="2" cellpadding="4" style="margin:0 auto;"> 
	 		
	            <p:dataTable id="items" var="item" value="#{reporteVentaBean.selectedVenta.items}"> 
	            	
	            	<p:column headerText="Codigo artículo" style="text-align: center">  
	            		#{item.codigoArticulo}  
	        		</p:column>  
	        		
	        		<p:column headerText="Cantidad" style="text-align: center">  
	            		#{item.cantidad}  
	        		</p:column>  
	        		
	            </p:dataTable>
	  		</h:panelGrid>
	  		
	    </p:dialog>  
   
   		<br></br>
  		<p:panel style="text-align: right">
					<p:commandButton id="menu" action="#{rankingBean.volverAlMenu}" value="Volver al menú principal"></p:commandButton>
		</p:panel>
   
   </h:form>

</h:body>

</f:view>   

</html>